<form class="form-horizontal" id="formSelectedSearchVideoGroup" method="post">
    <div class="form-group col-md-12 col-sm-3 col-md-offset-3">
        <div class="col-md-10 padding-left-none">
            <div class="form-group col-md-12">
                <div class="col-md-1">
                    <button type="button" class="btn btn-white btn-default btn-bold btn-sm btnRemoveSelectedVideoGroup" data-loading-text="<i class='ace-icon fa fa-spinner fa-spin blue bigger-125'></i>">
                        <i class="ace-icon fa fa-trash-o"></i>
                    </button>
                </div>
                <div class="col-md-11">
                    <div class="input-group">
                        <input type="text" class="form-control input-sm" placeholder="Nhập tên VideoGroup để tìm">
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-white btn-default btn-bold btn-sm">
                            Tìm
                            <i class="ace-icon fa fa-search icon-on-right bigger-110"></i>
                        </button>
                    </span>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-2">
            <a href="{{ url(config.application.backendUrl ~ '/ajax/videoGroup/loadVideoGroup?object_type=home-category&object_id=' ~ homeCategory.getId() ) }}" class="btn btn-white btn-default btn-bold btn-sm btnAddVideoGroup" data-toggle="modal" data-target="#modalAddVideoGroupHomeCategory">
                <i class="ace-icon glyphicon glyphicon-plus"></i>Thêm Video Group
            </a>
        </div>
    </div>
</form>

<form action="{{ url(config.application.backendUrl ~ '/video/ajaxVideoGroup/deleteVideoGroupFromObject?object_type=home-category&object_id=' ~ homeCategory.getId() ) }}" class="form-horizontal" id="formSelectedRemoveVideoGroup" method="post">
    <div class="form-group col-md-12 col-sm-3 col-md-offset-3">
        <div class="col-md-12">
            <table class="table">
                <thead>
                <tr>
                    <td>
                        <label class="position-relative">
                            <input type="checkbox" class="ace removeSelectedVideoGroupAll" name="removeSelectedVideoGroupAll" ng-click="checkRemoveSelectedVideoGroupAll()">
                            <span class="lbl"></span>
                        </label>
                    </td>
                    <td>Hình ảnh</td>
                    <td>Tên VideoGroup</td>
                    <td>Quốc gia</td>
                    <td>Thể loại</td>
                    <td>Vị trí</td>
                </tr>
                </thead>
                <tbody id="listSelectedVideoGroup">
                {% if(homeVideosGroups) %}
                    {% for homeVideoGroup in homeVideosGroups %}
                        {% if(homeVideoGroup.videoGroup) %}
                            <tr id="selectedVideoGroupToHomeVideoGroup{{ homeVideoGroup.videoGroup.getId() }}">
                                <td>
                                    <label class="position-relative">
                                        <input type="checkbox" class="ace selectedVideoGroupRemove" name="selectedVideoGroupRemove[]" value="{{ homeVideoGroup.videoGroup.getId()}}">
                                        <span class="lbl"></span>
                                    </label>
                                </td>
                                <td>
                                    {% if(homeVideoGroup.videoGroup.imageLink.getFirst()) %}
                                        {{ image( constant.pathUploadImage ~ homeVideoGroup.videoGroup.imageLink.getFirst().images.getImagePath() , 'width' : '250') }}
                                    {% endif %} <br />
                                </td>
                                <td>{{ homeVideoGroup.videoGroup.VideoDescription.getName() }}</td>
                                <td>
                                    {# homeVideoGroup.videoGroup.national ? homeVideoGroup.videoGroup.national.getName() : '' #}
                                </td>
                                <td>
                                    {% if(homeVideoGroup.videoGroup.videoCategoryLink) %}
                                        {% for videoCategoryLink in homeVideoGroup.videoGroup.videoCategoryLink %}
                                            {{ videoCategoryLink.category.getName() ~ ' , ' }}
                                        {% endfor %}
                                    {% endif %}
                                </td>
                                <td>{{ homeVideoGroup.getPosition() }}</td>
                            </tr>
                        {% endif %}
                    {% endfor %}
                {% endif %}
                </tbody>
            </table>
        </div>
    </div>
</form>

<div class="clearfix"></div>

<!-- Modal -->
<div class="modal fade" id="modalAddVideoGroupHomeCategory" tabindex="-1" role="dialog" aria-labelledby="modalAddVideoGroupHomeCategory" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Modal title</h4>

            </div>
            <div class="modal-body"><div class="te"></div></div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<!-- /.modal -->